<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>已录资料</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">

    <link rel="stylesheet" href="../lib/sui/sm.min.css">
    <link rel="stylesheet" href="../lib/sui/sm-extend.min.css">

    <link rel="stylesheet" href="../css/reset.css">
    <link rel="stylesheet" href="../css/main.css">
    <link rel="stylesheet" href="../css/public_main.css">
</head>

<body>
    <div class="page-group">
        <div class="page page-current" id="dataList">
            <!-- 主内容 -->
            <div class="content">
                <div class="search-bar">
                    <div class="search-box">
                        <input type="search" class="search-bar__input" id="searchInput" placeholder="搜索" required="">
                    </div>
                    <div class="search-select">
                        <input readonly="readonly" style="width: 100%;" value="全部" id="selectInput" />
                        <div style="display: none;" class="selectInputDiv">
                            <ul style="list-style: none;margin: 0;padding: 0;text-align: center;">
                                <li>孙逸</li>
                                <li>张三</li>
                                <li>李四</li>
                                <li>王五</li>
                                <li>二麻子</li>
                                <li>小六子</li>
                                <li>九儿</li>
                                <li>巴迪</li>
                                <li>九个</li>
                                <li>四爷</li>
                            </ul>
                        </div>
                    </div>
                </div>
                <div class="content-block native-scroll">
                    <div class="list-block">
                        <ul>
                            <li>
                                <a href="" class="item-link item-content">
                                    <div class="item-inner">
                                        <div class="item-title">
                                            <div class="title-num size-n">报案号：12344534794859</div>
                                            <div class="time size-m">2018-10-04 12:34:20</div>
                                        </div>
                                        <div class="status">驳回修改</div>
                                    </div>
                                </a>
                            </li>
                            <li>
                                <a href="" class="item-link item-content">
                                    <div class="item-inner">
                                        <div class="item-title">
                                            <div class="title-num size-n">报案号：12344534794859</div>
                                            <div class="time size-m">2018-10-04 12:34:20</div>
                                        </div>
                                        <div class="status">未递交审核</div>
                                    </div>
                                </a>
                            </li>
                            <li>
                                <a href="" class="item-link item-content">
                                    <div class="item-inner">
                                        <div class="item-title">
                                            <div class="title-num size-n">报案号：12344534794859</div>
                                            <div class="time size-m">2018-10-04 12:34:20</div>
                                        </div>
                                        <div class="status">待审核</div>
                                    </div>
                                </a>
                            </li>
                            <li>
                                <a href="" class="item-link item-content">
                                    <div class="item-inner">
                                        <div class="item-title">
                                            <div class="title-num size-n">报案号：12344534794859</div>
                                            <div class="time size-m">2018-10-04 12:34:20</div>
                                        </div>
                                        <div class="status">物权人未委托</div>
                                    </div>
                                </a>
                            </li>
                            <li>
                                <a href="" class="item-link item-content">
                                    <div class="item-inner">
                                        <div class="item-title">
                                            <div class="title-num size-n">报案号：12344534794859</div>
                                            <div class="time size-m">2018-10-04 12:34:20</div>
                                        </div>
                                        <div class="status">拍卖已完成</div>
                                    </div>
                                </a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <script type='text/javascript' src='../lib/sui/zepto.min.js' charset='utf-8'></script>
    <script type='text/javascript' src='../lib/sui/sm.min.js' charset='utf-8'></script>
    <script type='text/javascript' src='../lib/sui/sm-extend.min.js' charset='utf-8'></script>
    <script>
        $("#selectInput").click(function () {
            //点击输入框打开选项窗，若已打开则关闭
            if ($(".selectInputDiv").css('display') == 'none') {
                $(".selectInputDiv").show();
                $('.selectInputDiv li:contains(' + $(this).val() + ')').css('background-color', 'orange')
            } else {
                $(".selectInputDiv").hide();
            }
        })
        $(".selectInputDiv li").click(function () {
            //点击选择时为输入框赋值。并关闭选项窗
            $("#selectInput").val($(this).text())
            $(".selectInputDiv").hide();
        })
        //为选项设置颜色
        $(".selectInputDiv li").mouseover(function () {
            $('.selectInputDiv li').css('background-color', 'white')
            $(this).css({
                'cursor': 'pointer',
                // 'background-color': 'orange'
            });
        })
    </script>
</body>


</html>